<template>
    <div class="app">
        <div>
            <p>年级主任拥有生成年级成绩的权限, 请选择所在学校和年级入学的时间,在成绩之前请确保成绩录入完成</p>
        </div>
        <el-form :model="formDate" label-width="left" style="width: 400px">
            <el-form-item label="所在学校">
                <el-select v-model="formDate.SchoolName">
                    <el-option v-for="item in school_name" :key="item.value" :label="item.label"
                        :value="item.label"></el-option>
                </el-select>
            </el-form-item>
            <el-form-item label="所在年级的入学时间">
                <el-input v-model="formDate.yearTime"></el-input>
            </el-form-item>
        </el-form>

        <div v-if="formDate.SchoolName && formDate.yearTime">
            <el-button type="warning" :icon="Star" circle @click="getOverMonth()" />
            <span style="margin-left: 10px;"> 查看已经生成成绩的月份信息</span>

            <div style="margin-top: 20px;">
                <!-- 生成月份的成绩 -->
                <label style="margin-right:20px">请先选择生成成绩的日期</label>
                <el-date-picker type="month" v-model="formDate.time" format="YYYY-MM" value-format="YYYY-MM"
                    placeholder="请选择日期" clearable></el-date-picker>
            </div>
        </div>

        <!--  -->
        <div v-if="formDate.SchoolName && formDate.yearTime && formDate.time" style="margin-top: 20px;">
            <el-button type="danger" @click="genScore">点击生成成绩</el-button>
        </div>
    </div>

    <el-drawer v-model="drawer" title="I am the title" :with-header="false">
        <ul>
            <!-- 使用 v-for 来循环渲染 currentdeptscore 数组的内容 -->
            <li v-for="(score, index) in currentdeptscore" :key="index">
                {{ score }}
            </li>
        </ul>
    </el-drawer>
</template>
<script setup>
import {
    Check,
    Delete,
    Edit,
    Message,
    Search,
    Star,
} from '@element-plus/icons-vue'
const { proxy } = getCurrentInstance();
const drawer = ref(false)
// 当时已经生成成绩的信息
const currentdeptscore = ref([])
import { questScore, getAllTime, getDeptList } from '@/api/genetate/genetate'
import { reactive, ref, toRefs } from "vue";
import { time } from "echarts";
const { school_name } = proxy.useDict('school_name');
const formDate = ref({
    SchoolName: "",
    yearTime: "",
    time: ""
})

// 获取已经生成的月份的信息
function getOverMonth() {
    drawer.value = true
    getAllTime(formDate.value.yearTime, formDate.value.SchoolName).then(res => {
        // 将字符串分割成数组
        currentdeptscore.value = res.split(', ').sort((a, b) => {
            return new Date(a) - new Date(b)
        })
    })
}

// 点击生成成绩信息
function genScore() {
    var temp = formDate.value.time
    if (!currentdeptscore.value.includes(formDate.value.time)) {
        proxy.$modal.confirm('确认该月份成绩已经录入成功吗?').then(() => {
            questScore(formDate.value.yearTime, formDate.value.SchoolName, temp).then(res => { 
                proxy.$modal.msgSuccess("成绩生成成功")
            })
        })
        .catch(() => {
            proxy.$modal.error("成绩生成失败")
        })
    } else {
        proxy.$modal.msgError("该时间成绩已经生成")
    }
}
</script>
<style scoped>
.app {
    margin: 20px;
}
</style>
